<template>
  <div class="vm-common-item-list">
    <mt-loadmore
      :top-method="loadTop"
      :bottom-method="loadBottom"
      :bottom-all-loaded="allLoaded"
      ref="loadmore"
      :autoFill="false">
      <ul class="content">
        <router-link :to="'/common_details/' + item.bid +'/公告详情?btnShow=myoffer&prompt=true'" tag="li" class="common-item-box" v-for="(item, key) in transactionData" :key="key">
          <div class="idx-warp-l">
            <img src="../../../static/images/vm-common-ltem-list.png" alt="">
          </div>
          <div class="idx-warp-r">
            <div class="idx-r-t">
              <span class="t-content">{{ item.cIBidsTatle }}</span>
              <span class="t-time">{{ item.dCenterDate }}</span>
            </div>
            <div class="idx-r-f">
              <span class="f-area">单位：{{ item.companyName }}</span>
              <span :class="['f-type',item.ClassName]">阶段：{{ item.iRangeStatus }}</span>
            </div>
          </div>
        </router-link>
      </ul>
      <vm-common-noData v-if="!transactionData"></vm-common-noData>
    </mt-loadmore>
  </div>
</template>

<script>
import { transactionIndex } from '@/api/businessTransctionCenter.js'
export default {
  data () {
    return {
      transactionData: new Array(),
      transactionPage: 1,
      allLoaded: false,
      value: ''
    }
  },
  created () {
    // 获取业务交易中心接口
    this.getTransactionIndexData('bottom');
  },
  mounted () {
    this.$root.Bus.$on('vmCommonSearchV', (value) => {
      this.value = value;
      this.getTransactionIndexData();
    })
  },
  methods: {
    getTransactionIndexData(loadmoreType) {
      let data = {
        page: this.transactionPage,
        type: 0,
        companyname: this.value
      }
      transactionIndex({...data}).then(async res => {
        if ( !res.data.data ) {
          this.allLoaded = true; // 若数据已全部获取完毕
        } else {
          res.data.data.map((item, key, arr) => {
            switch ( item.iRangeStatus ) {
              case '公告期':
                item.ClassName = 'announcementPeriod';
                break;
              case '投标期':
                item.ClassName = 'tender';
                break;
              case '新建':
                item.ClassName = 'create';
                break;
              case '评标期':
                item.ClassName = 'bidEvaluationPeriod';
                break;
              case '结束期':
                item.ClassName = 'end';
                break;
              case '工程设计':
                item.ClassName = 'ed';
                break;
            }
            return item;
          });
        }
        if ( this.transactionPage == 1 || this.value) {
          this.allLoaded = false;
          this.transactionData = res.data.data;
        } else {
          this.transactionData = this.transactionData.concat(res.data.data);
        }
        if (loadmoreType == 'top') {
          await this.$refs.loadmore.onTopLoaded();
        } else if (loadmoreType == 'bottom'){
          await this.$refs.loadmore.onBottomLoaded();
          if (this.transactionPage == 1) {
            document.getElementsByClassName('vm-common-item-list')[0].scrollTop = 0;
          }
        }

      })
    },
    loadTop () {
      this.transactionPage = 1;
      this.getTransactionIndexData('top');
    },
    loadBottom () {
      this.transactionPage ++;
      this.getTransactionIndexData('bottom');
    }
  }
}
</script>

<style lang="scss" scoped>
.vm-common-item-list {
  margin-top: 20px;
  height: calc( 100% - 200px ) !important;
  overflow: scroll !important;
}
</style>
